function Banner(){
    this.index = 0;
    this.prev_btn = document.querySelector('#prev_btn');
    this.next_btn = document.querySelector('#next_btn');
    this.banner_container = document.querySelector('#banner_container')
    this.slides = document.querySelectorAll('#banner_container li')
    this.conTainer = document.querySelector('#container')
    this.bindEvent();
    this.autoPlay()
}
Banner.prototype.bindEvent = function(){
    var self = this;
    var max_index = self.slides.length - 1;
    self.prev_btn.onclick = function(){
        if(self.index === 0){
            self.banner_container.style.left = -(max_index) * 1180 + 'px';
            self.index = max_index - 1;
        }else{
            self.index--;
        }
        self.changeSlide();
    }
    self.next_btn.onclick = function(){
        if(self.index === max_index){
            self.banner_container.style.left = 0;
            self.index = 1
        }else{
            self.index ++
        }
        self.changeSlide();
    }
}
Banner.prototype.changeSlide = function(){
    $(this.banner_container).stop()
    .animate({
        left:-this.index * 1180
    },1000)
}
Banner.prototype.autoPlay = function(){
    var self = this;
    var t = setInterval(function(){
        self.next_btn.onclick()
    },2000)
    this.conTainer.onmouseover = function(){
        clearInterval(t);
    }
    this.conTainer.onmouseout = function(){
        t = setInterval(function(){
            self.next_btn.onclick();
        },2000)
    }
}
var bann = new Banner();